<%@page contentType="text/html" pageEncoding="UTF-8" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
    <head>
        <title>SportingEventClub - Registrazione</title>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>        
        <link rel="stylesheet" type="text/css" href="CSS/BaseSite.css" /> 
        <link rel="stylesheet" type="text/css" href="CSS/vertical-ticker.css"/>
        <link rel="shortcut icon" href= "Images/stadion-icon.png"/>
        <script type="text/javascript">            
            function DrawCaptcha()
            {
                var a = Math.ceil(Math.random() * 10)+ '';
                var b = Math.ceil(Math.random() * 10)+ '';       
                var c = Math.ceil(Math.random() * 10)+ '';  
                var d = Math.ceil(Math.random() * 10)+ '';  
                var e = Math.ceil(Math.random() * 10)+ '';  
                var f = Math.ceil(Math.random() * 10)+ '';  
                var g = Math.ceil(Math.random() * 10)+ '';  
                var code = a + ' ' + b + ' ' + ' ' + c + ' ' + d + ' ' + e + ' '+ f + ' ' + g;
                document.getElementById("txtCaptcha").value = code
            }
            function ValidCaptcha(){
                var str1 = removeSpaces(document.getElementById('txtCaptcha').value);
                var str2 = removeSpaces(document.getElementById('txtInput').value);
                if (str1 == str2) return true;        
                return false;
            }
            function removeSpaces(string)
            {
                return string.split(' ').join('');
            }
            function verifica(modulo){
                
                var nome=document.getElementById("nomeErr");                 
                var cognome=document.getElementById("cognomeErr");
                var codfiscale=document.getElementById("codicefiscaleErr");
                var luogonascita=document.getElementById("luogonascitaErr");
                var datanascita=document.getElementById("datanascitaErr");
                var indirizzo=document.getElementById("indirizzoErr");
                var email=document.getElementById("emailErr");                
                var password1=document.getElementById("password1Err");
                var password2=document.getElementById("password2Err");
                var telefono=document.getElementById("telefonoErr");
                var termini=document.getElementById("terminiErr");
                var captcha=document.getElementById("captchaErr");
                                
                var patternMail = /[a-z0-9!#$%&'*+/=?^_`{|}~-]+(?:\.[a-z0-9!#$%&'*+/=?^_`{|}~-]+)*@(?:[a-z0-9](?:[a-z0-9-]*[a-z0-9])?\.)+[a-z0-9](?:[a-z0-9-]*[a-z0-9])?/;
                var patternSpecialChar = /^([a-zA-Z\xE0\xE8\xE9\xF9\xF2\xEC\x27]\s?)+$/;              
                var patternPassword = /[a-zA-Z0-9\_\*\-\+\!\?\,\:\;\.\xE0\xE8\xE9\xF9\xF2\xEC\x27]{6,12}/;
                var patternCodFisc = /^[a-zA-Z]{6}[0-9]{2}[a-zA-Z][0-9]{2}[a-zA-Z][0-9]{3}[a-zA-Z]$/;
                                
                nome.style.visibility = "hidden";
                cognome.style.visibility = "hidden";
                codfiscale.style.visibility = "hidden";                
                datanascita.style.visibility = "hidden";                
                indirizzo.style.visibility = "hidden";
                email.style.visibility = "hidden";
                luogonascita.style.visibility = "hidden";
                password1.style.visibility = "hidden";
                password2.style.visibility = "hidden";
                telefono.style.visibility = "hidden";
                termini.style.visibility = "hidden";
                
                var i =0;
                if(modulo.nome.value == "" || !(patternSpecialChar.test(modulo.nome.value)))
                {
                    nome.style.visibility = "visible";
                    modulo.nome.focus();
                    i++;                   
                } 
                if(modulo.cognome.value== "" || !(patternSpecialChar.test(modulo.cognome.value)))
                {                    
                    cognome.style.visibility = "visible";
                    i++;
                }
                if(modulo.codicefiscale.value== "" || !(patternCodFisc.test(modulo.codicefiscale.value)))
                {                    
                    codfiscale.style.visibility = "visible";
                    i++;
                }                
                if(modulo.luogonascita.value =="" || !(patternSpecialChar.test(modulo.luogonascita.value)))
                {
                    luogonascita.style.visibility = "visible";                  
                    i++;
                }                
                if(modulo.giornonascita.value==-1 || modulo.mesenascita.value==-1 || modulo.annonascita.value==-1)
                {
                    datanascita.style.visibility = "visible";                  
                    i++;
                }                
                if(modulo.indirizzo.value=="" || !(patternSpecialChar.test(modulo.indirizzo.value)))
                {
                    indirizzo.style.visibility = "visible";
                    i++;
                }
                if(modulo.email.value=="" || !(patternMail.test(modulo.email.value)))
                {                    
                    email.style.visibility = "visible";
                    i++;
                }                
                if(modulo.password1.value=="" || !(patternPassword.test(modulo.password1.value)))
                {                    
                    password1.style.visibility = "visible";
                    i++;
                } 
                if(modulo.telefono.value=="")
                {
                    telefono.style.visibility = "visible";
                    i++;
                }
                if(!(modulo.password1.value == modulo.password2.value) || modulo.password2.value == "")
                {
                    password2.style.visibility = "visible";
                    i++;
                }   
                if(modulo.termini.checked == false)
                {
                    termini.style.visibility = "visible";
                    i++;
                }
                if(!ValidCaptcha())
                {
                    captcha.style.visibility ="visible";
                    i++;
                }
                if(i > 0)
                    return false;
                else
                    return true;
            }                      
        </script>
        <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
        <script type="text/javascript" src="JQuery/jquery.totemticker.js"></script>
    </head>
    <body onload="DrawCaptcha();">
        <div class="main">
            <div class="page">
                <div class="header">       
                    <div class="login">
                        <%@include file="login.jsp" %>
                    </div>
                    <div class="banner">
                    </div>
                    <div class="topmenu">
                        <%@include file="topmenu.jsp" %>
                    </div>
                </div>
                <div class="content">
                    <div class="content-in">
                        <div class="left-panel">
                            <div class="left-panel-in">
                                <%session = request.getSession();
                                String insert = (String) session.getAttribute("checkInsertUtente");
                                if(insert == null){%>
                                <section class="insertModule">
                                    <form name="registazione" class="registrazione" action="GeneralController" method="post" onsubmit="return verifica(this);" onload="DrawCaptcha();"><!----> 
                                        <h1>Registrazione nuovo utente</h1>
                                          <h3>Dati Personali:</h3>
                                          <table width="85%" height="424" border="0" align="center" style="margin-left: 80px;">
                                            <tr>
                                              <th width="60%" height="30" scope="col">
                                                <label> 
                                                    <div align="left">Nome :</div>
                                                </label> 
                                                <div align="left">
                                                    <input id="nome" name="nome" type="text" value="" /> 
                                                </div>
                                              </th>
                                              <th width="60%" scope="col">
                                                <label> 
                                                    <div align="left">Cognome :</div>
                                                </label>
                                                <div align="left">
                                                    <input id="cognome" name="cognome" maxlength="255" type="text" />
                                                </div>
                                              </th>
                                            </tr>
                                            <tr>
                                              <th height="23" scope="col">
                                                <div class="errorMessage" id="nomeErr">
                                                    <div align="left">Inserire il nome (campo obbligatorio)</div>
                                                </div>
                                              </th>
                                              <th width="60%" scope="col">
                                                <div class="errorMessage" id="cognomeErr">
                                                    <div align="left">
                                                        Inserire il cognome (campo obbligatorio) 
                                                    </div>
                                                </div>
                                              </th>
                                            </tr>
                                            <tr>
                                              <th height="30" scope="col">
                                                <label>
                                                    <div align="left">Codice Fiscale:</div>
                                                </label>
                                                <div align="left">
                                                    <input  id="codicefiscale" name="codicefiscale" maxlength="255" type="text" />
                                                </div>
                                              </th>
                                              <th scope="col"> 
                                                <label>
                                                    <div align="left">Luogo di nascita:</div>
                                                </label>
                                                <div align="left">
                                                  <input  id="luogonascita" name="luogonascita" maxlength="255" type="text" />
                                                </div>
                                              </th>
                                            </tr>
                                            <tr>
                                              <th height="23" scope="col">
                                                  <div id="codicefiscaleErr" class="errorMessage"> 
                                                    <div align="left">
                                                        Inserire il codice fiscale (campo obbligatorio) 
                                                    </div>
                                                  </div>
                                              </th>
                                              <th width="60%" scope="col">
                                                <div id="luogonascitaErr" class="errorMessage">
                                                    <div align="left">
                                                        Inserire luogo nascita (campo obbligatorio) 
                                                    </div>
                                                </div>
                                              </th>
                                            </tr>
                                            <tr>
                                              <th height="23" scope="col">
                                                  <label>
                                                    <div align="left">Data di nascita:</div>
                                                  </label>
                                                  <div align="left" style="margin-left: -20px;">
                                                    <select name="giornonascita" id="datanascita" placeholder="Giorno" >
                                                        
                                                      <option value="1">1</option>
                                                      <option value="2">2</option>
                                                      <option value="3">3</option>
                                                      <option value="4">4</option>
                                                      <option value="5">5</option>
                                                      <option value="6">6</option>
                                                      <option value="7">7</option>
                                                      <option value="8">8</option>
                                                      <option value="9">9</option>
                                                      <option value="10">10</option>
                                                      <option value="11">11</option>
                                                      <option value="12">12</option>
                                                      <option value="13">13</option>
                                                      <option value="14">14</option>
                                                      <option value="15">15</option>
                                                      <option value="16">16</option>
                                                      <option value="17">17</option>
                                                      <option value="18">18</option>
                                                      <option value="19">19</option>
                                                      <option value="20">20</option>
                                                      <option value="21">21</option>
                                                      <option value="22">22</option>
                                                      <option value="23">23</option>
                                                      <option value="24">24</option>
                                                      <option value="25">25</option>
                                                      <option value="26">26</option>
                                                      <option value="27">27</option>
                                                      <option value="28">28</option>
                                                      <option value="29">29</option>
                                                      <option value="30">30</option>
                                                      <option value="31">31</option>
                                                </select>
                                                    <select name="mesenascita" id="datanascita">                                                        
                                                      <option value="1">Gennaio</option>
                                                      <option value="2">Febbraio</option>
                                                      <option value="3">Marzo</option>
                                                      <option value="4">Aprile</option>
                                                      <option value="5">Maggio</option>
                                                      <option value="6">Giugno</option>
                                                      <option value="7">Luglio</option>
                                                      <option value="8">Agosto</option>
                                                      <option value="9">Settembre</option>
                                                      <option value="10">Ottobre</option>
                                                      <option value="11">Novembre</option>
                                                      <option value="12">Dicembre</option>
                                                </select>
                                                    <select name="annonascita" id="datanascita">
                                                        
                                                      <option value="1960">1960</option>
                                                      <option value="1961">1961</option>
                                                      <option value="1962">1962</option>
                                                      <option value="1963">1963</option>
                                                      <option value="1964">1964</option>
                                                      <option value="1965">1965</option>
                                                      <option value="1966">1966</option>
                                                      <option value="1967">1967</option>
                                                      <option value="1968">1968</option>
                                                      <option value="1969">1969</option>
                                                      <option value="1970">1970</option>
                                                      <option value="1971">1971</option>
                                                      <option value="1972">1972</option>
                                                      <option value="1973">1973</option>
                                                      <option value="1974">1974</option>
                                                      <option value="1975">1975</option>
                                                      <option value="1976">1976</option>
                                                      <option value="1977">1977</option>
                                                      <option value="1978">1978</option>
                                                      <option value="1979">1979</option>
                                                      <option value="1980">1980</option>
                                                      <option value="1981">1981</option>
                                                      <option value="1982">1982</option>
                                                      <option value="1983">1983</option>
                                                      <option value="1984">1984</option>
                                                      <option value="1985">1985</option>
                                                      <option value="1986">1986</option>
                                                      <option value="1987">1987</option>
                                                      <option value="1988">1988</option>
                                                      <option value="1989">1989</option>
                                                      <option value="1990">1990</option>
                                                      <option value="1991">1991</option>
                                                      <option value="1992">1992</option>
                                                      <option value="1993">1993</option>
                                                      <option value="1994">1994</option>
                                                      <option value="1995">1995</option>
                                                      <option value="1996">1996</option>
                                                      <option value="1997">1997</option>
                                                      <option value="1998">1998</option>
                                                      <option value="1999">1999</option>
                                                      <option value="2000">2000</option>
                                                      <option value="2001">2001</option>
                                                      <option value="2002">2002</option>
                                                      <option value="2003">2003</option>
                                                      <option value="2004">2004</option>
                                                      <option value="2005">2005</option>
                                                      <option value="2006">2006</option>
                                                      <option value="2007">2007</option>
                                                      <option value="2008">2008</option>
                                                </select>
                                                   </div>
                                               </th>
                                            <th scope="col">
                                              <label>
                                                  <div align="left">Sesso:</div>
                                              </label>
                                              <div align="left" style="margin-left: -20px;">
                                                <select name="sesso" id="sesso">
                                                  <option value="maschio" selected="selected">Maschio</option>
                                                  <option value="femmina">Femmina</option>
                                                </select>
                                              </div>
                                            </th>
                                            </tr>
                                            <tr>
                                              <th height="23" scope="col">
                                                  <div id="datanascitaErr" class="errorMessage"> 
                                                    <div align="left">Inserire una data di nascita valida (campo obbligatorio) </div>
                                                  </div>	        
                                              </th>
                                              <th scope="col">&nbsp;</th>
                                            </tr>
                                            <tr>
                                              <th height="29" scope="col">
                                          <label>        	
                                                  <div align="left">Comune di Residenza:</div>
                                          </label>
                                          </th>
                                              <td height="29" scope="col">&nbsp;</td>
                                        </tr>
                                            <tr>
                                              <td height="30" scope="col"><div align="left">
                                                <input  id="indirizzo" name="indirizzo" maxlength="255" type="text" />
                                          </div></td>
                                              <td height="30" scope="col">&nbsp;</td>
                                        </tr>
                                            <tr>
                                              <td height="29" scope="col">
                                                <div id="indirizzoErr" class="errorMessage">
                                                    <div align="left">Inserire indirizzo di residenza (campo obbligatorio) </div>
                                                </div>
                                              </td>
                                              <td height="29" scope="col">&nbsp;</td>
                                        </tr>
                                      </table>
                                            <h3 style="text-align: center;">User e Password:</h3>
                                            <table width="85%" border="0" align="center" style="margin-left: 80px;">
                                              <tr>
                                                <th width="60%" scope="col">
                                                  <label> 
                                                    <div align="left">Email:</div>
                                                  </label>
                                                  <div align="left">
                                                    <input  id="email" name="email" maxlength="255" type="text" />
                                                  </div>
                                                </th>
                                                <th width="60%" scope="col">
                                                  <label> 
                                                    <div align="left"">Password:</div>
                                                  </label>
                                                  <div align="left"  style="margin-left: -20px;">
                                                    <input class="passReg" id="password1" name="password1" maxlength="255" type="password" />
                                                  </div>
                                                </th>
                                              </tr>
                                              <tr>
                                                <td>
                                                  <div id="emailErr" class="errorMessage"> 
                                                  Inserire correttamente l'indirizzo email 
                                              </div>
                                            </td>
                                                <td>
                                                  <div id="password1Err" class="errorMessage"> 
                                                  Inserire la password (campo obbligatorio) 
                                                  </div>
                                            </td>
                                          </tr>
                                              <tr>
                                                <th width="60%" height="30" scope="col">
                                                  <label> 
                                                    <div align="left">Telefono: </div>
                                                  </label>
                                                  <div align="left">
                                                    <input id="telefono" name="telefono" maxlength="255" type="text" />
                                                  </div>
                                                </th>
                                                <th width="60%" scope="col">
                                                  <label> 
                                                    <div align="left">Conferma Password: </div>
                                                  </label>
                                                  <div align="left"  style="margin-left: -20px;">
                                                    <input class="passReg" id="password2" name="password2" maxlength="255" type="password" />
                                                  </div>
                                                </th>
                                               </tr>
                                              <tr>
                                                <td>
                                                    <div id="telefonoErr" class="errorMessage"> Confermare il numero di telefono (campo obbligatorio) </div>
                                                </td>
                                                <td>
                                                    <div id="password2Err" class="errorMessage"> Conferma la password (campo obbligatorio) </div>
                                                </td>
                                              </tr>
                                              <tr>
                                                <td colspan="2">&nbsp;

                                            </td>
                                          </tr>
                                              <tr>
                                                  <td colspan="2" align="left">          	
                                                    <label>                                                        
                                                        <input name="termini" type="checkbox" id="myCheck" value="myvalue"><u>Acconsento informativa sull'uso dei dati personali.</u>
                                                    </label>
                                                    <div id="terminiErr" class="errorMessage" style="text-align:left;">Acconsenti al trattamento dei dati (campo obbligatorio) </div>
                                                </td>
                                              </tr>
                                              <tr>
                                                <td colspan="2" align="left">
                                                    <div>
                                                        <input id="txtCaptcha" type="text" readonly="" class="input_img" src="Images\captcha.png" style="border:1px solid;">
                                                        <img src="Images\refresh.png" id="btnrefresh" onclick="DrawCaptcha();" style=" margin-bottom:-5px; cursor:pointer; width: 24px; height: 24px;"/><br>
                                                        <input type="text" id="txtInput" style=""/>
                                                    </div>
                                                    <div id="captchaErr" class="errorMessage" style="text-align: left;">Inserire codice Captcha corretto (campo obbligatorio)</div>
                                                </td>                                                
                                              </tr>
                                      </table>                                                                                          
                                      <button type="submit" class="myButton blue" id="btnsubmit" name="submit" value="Registrazione" style="margin-bottom:30px; margin-left: 25px;">Registrati</button>     
                                    </form>
                                    <% } else if (insert.equals("inserimentoEffettuato")){ %>
                                    Registrazione avvenuta con successo, controllare l'email per attivare l'account<br/>
                                    <a href="homepage.jsp">Torna alla home</a>
                                    <% session.invalidate(); %>
                                <%}else if(insert.equals("ErroreCredenziali")){%>
                                        Errore nella registrazione, inserire correttamente tutti i campi obbligatori<br/>
                                        <a href="registrazione.jsp">Torna alla registrazione</a>
                                        <% session.invalidate();%>                                 
                                <%}else if(insert.equals("errore")){%>
                                        Si è verificato un problema al sistema, riprovare più tardi o effettuare nuovamente la registrazione<br/>
                                        <a href="registrazione.jsp">Torna alla registrazione</a>
                                        <% session.invalidate();%>                                
                                <%} else if(insert.equals("ErroreUtente")){%>
                                        L'indirizzo email utilizzato è già associato ad un account<br/>
                                        <a href="registrazione.jsp">Torna alla registrazione</a>
                                        <% session.invalidate(); 
                                }%>
                            </div>
                        </div>
                        <div class="right-panel">
                            <div class="right-panel-in">
                                 <jsp:include page="/GeneralController">
                                    <jsp:param name="submit" value="right-content"/>
                                    <jsp:param name="op" value="newsbox"/>
                                </jsp:include>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="footer">
                    <%@include file="footer.jsp" %> 
                </div>
            </div>
        </div> 
    </body>
</html>
